<template>
  <view class="main-pd u-p-t-20">
    <view class="u-card">
      <view class="list-item">
        <view class="u-flex u-flex-between">
          <view>姓名</view>
          <view>
            {{ userStore.dzkName || "" }}
          </view>
        </view>
      </view>
      <view class="list-item">
        <view class="u-flex u-flex-between">
          <view>性别</view>
          <view>
            {{ userStore.dzkSex || "" }}
          </view>
        </view>
      </view>
      <view class="list-item">
        <view class="u-flex u-flex-between">
          <view>所在单元</view>
          <view>
            {{ userStore.louNumber }}号楼{{ userStore.dyNumber }}单元{{
              userStore.fjNumber
            }}号
          </view>
        </view>
      </view>
      <view class="list-item">
        <view class="u-flex u-flex-between">
          <view>联系方式</view>
          <view>
            <u-input
              placeholder="请输入联系方式"
              border="none"
              v-model="phone"
              inputAlign="right"
              fontSize="32rpx"></u-input>
          </view>
        </view>
      </view>
      <view class="list-item">
        <view class="u-flex u-flex-between">
          <view class="w-200">报名时间</view>
          <view>
            {{ time || "" }}
          </view>
        </view>
      </view>
      <view class="list-item">
        <view class="u-flex u-flex-between">
          <view>所属小区</view>
          <view>
            {{ userStore.deptName || "" }}
          </view>
        </view>
      </view>
    </view>
    <view class="u-m-t-106 u-p-b-80">
      <u-button
        text="立即报名"
        shape="circle"
        color="linear-gradient(90deg, #FA827D 0%, #F34B47 100%)"
        :customStyle="{
          fontSize: '36rpx',
          height: '96rpx',
        }"
        @click="joinActive"></u-button>
    </view>
  </view>
</template>

<script setup>
import useInfoStore from "@/store/user";
import { onLoad } from "@dcloudio/uni-app";
import { ref } from "vue";
import { joinActiveApi } from "@/api/index";
const userStore = useInfoStore();
let time = ref("");
let phone = ref("");
let activityId = ref("");
const joinActive = () => {
  if (!phone.value) {
    uni.$u.toast("请输入联系方式！");
    return false;
  }
  if (!uni.$u.test.mobile(phone.value)) {
    uni.$u.toast("请输入正确的联系方式！");
    return false;
  }
  joinActiveApi({
    activityId: activityId.value,
    dzyzkId: userStore.dzyzkId,
    openId: userStore.openId,
    phone: phone.value,
  }).then((res) => {
    if (res.success) {
      uni.$u.toast("报名成功！");
      setTimeout(() => {
        uni.$emit("refresh", { refresh: true });
        uni.navigateBack();
      }, 800);
    } else {
      uni.$u.toast(res.msg);
    }
  });
};
onLoad((param) => {
  time.value = param.hdTime;
  activityId.value = param.activityId;
  phone.value = userStore.dzkTel;
});
</script>

<style lang="scss" scoped></style>
